<template>
  <div>
    <div class="item-info">
      <div
        :class="['single-item', item.flag ? 'active-item' : '']"
        v-for="(item, index) in singleItemList"
        :key="index"
      >
        <div>{{ item.name }}</div>
        <div class="item-logo">
          <img :src="item.logo" alt="" />
        </div>
      </div>
      <div class="single-item-info">
        <div class="info-line1">
          <div>{{ gameTitle }}</div>
          <div class="venue">{{ venueName }}</div>
        </div>
        <div class="info-line2">
          <div class="report-name">成绩公告</div>
          <div>{{ gameTime }}</div>
        </div>
      </div>
    </div>
    <div class="game-info">
      <el-col :span="3">
        <div>{{ tableData.column1 }}</div>
      </el-col>
      <el-col :span="9">
        <div class="game-a" style="color: rgba(0,0,0,0)">{{ tableData.column2 }}</div>
      </el-col>
      <el-col :span="3">
        <div class="game-vs">{{ tableData.column3 }}</div>
      </el-col>
      <el-col :span="9">
        <div class="game-b" style="color: rgba(0,0,0,0)">{{ tableData.column4 }}</div>
      </el-col>
    </div>
    <div class="game-table-data">
      <el-row :gutter="24">
        <el-col :span="3" class="col-style-1">
          <el-table :data="startList" style="width: 100%">
            <el-table-column
              prop="table"
              label="台号"
              header-align="center"
              align="center"
            ></el-table-column>
          </el-table>
        </el-col>
        <el-col :span="9" class="col-style">
          <el-table :data="startList" style="width: 100%">
            <el-table-column label="队编号" header-align="center" align="center">
              <template slot-scope="scope">
                <div :class="getTableOtherStyle(scope.row.GroupName2)">
                  {{ scope.row.Team1 }}
                </div>
              </template>
            </el-table-column>
            <el-table-column label="单位/姓名" min-width="130%">
              <template slot-scope="scope">
                <div :class="[getTableTeamStyle(scope.row.GroupName1, '')]">
                  {{ scope.row.GroupName1 }}
                </div>
              </template>
            </el-table-column>
            <el-table-column label="积分" header-align="center" align="center">
              <template slot-scope="scope">
                <div :class="getTableOtherStyle(scope.row.GroupName2)">
                  {{ scope.row.JiFen1 }}
                </div>
              </template>
            </el-table-column>
          </el-table>
        </el-col>
        <el-col :span="3" class="col-style">
          <el-table :data="startList" style="width: 100%" header-align="center">
            <el-table-column prop="" header-align="center">
              <template slot="header" slot-scope="scope">
                <div class="game-vs-logo"></div>
              </template>
            </el-table-column>
          </el-table>
        </el-col>
        <el-col :span="9" class="col-style-2">
          <el-table :data="startList" style="width: 100%">
            <el-table-column label="积分" header-align="center" align="center">
              <template slot-scope="scope">
                <div :class="getTableOtherStyle(scope.row.GroupName2)">
                  {{ scope.row.JiFen2 }}
                </div>
              </template>
            </el-table-column>
            <el-table-column label="队编号" header-align="center" align="center">
              <template slot-scope="scope">
                <div :class="getTableOtherStyle(scope.row.GroupName2)">
                  {{ scope.row.Team2 }}
                </div>
              </template>
            </el-table-column>
            <el-table-column label="单位/姓名" min-width="130%">
              <template slot-scope="scope">
                <div :class="[getTableTeamStyle('', scope.row.GroupName2)]">
                  {{ scope.row.GroupName2 }}
                </div>
              </template>
            </el-table-column>
          </el-table>
        </el-col>
      </el-row>
    </div>
    <div class="game-legend">
      <div class="legend-title">注释</div>
      <div class="legend-content">
        <span class="legend-content-title">*</span>
        <span>先手</span>
      </div>
    </div>
  </div>
</template>
<script>
import { mapState } from 'vuex'
export default {
  created() {
    this.venueName = this.$route.query.venueName
    this.gameTime = this.$route.query.gameTime
    this.gameTitle = this.$route.query.gameTitle
  },
  props: {},
  data() {
    return {
      tableData: {
        column1: '对阵',
        column2: '-',
        column3: '当前成绩',
        column4: '-'
      },
      venueName: '',
      gameTime: '',
      gameTitle: '',
      startList: [
        {
          table: null,
          Team1: '13',
          GroupName1: '深圳市代表队',
          Team2: '1',
          GroupName2: '湖北省代表队',
          Result: '',
          TeamResult: 'Y',
          JiFen1: '0',
          JiFen2: '0'
        },
        {
          table: '1-1',
          Team1: '',
          GroupName1: '*任皓麟',
          Team2: '',
          GroupName2: '泮忆铭',
          Result: '0:2',
          TeamResult: null,
          JiFen1: null,
          JiFen2: ''
        },
        {
          table: '1-2',
          Team1: '',
          GroupName1: '蔡杰程',
          Team2: '',
          GroupName2: '*李振宇',
          Result: '0:2',
          TeamResult: null,
          JiFen1: null,
          JiFen2: ''
        },
        {
          table: '1-3',
          Team1: null,
          GroupName1: '*余曼琪',
          Team2: '',
          GroupName2: '赵汗青',
          Result: '0:2',
          TeamResult: null,
          JiFen1: null,
          JiFen2: ''
        },
        {
          table: null,
          Team1: '2',
          GroupName1: '河北省代表队',
          Team2: '14',
          GroupName2: '山东省代表队',
          Result: '',
          TeamResult: 'Y',
          JiFen1: '0',
          JiFen2: '0'
        },
        {
          table: '2-1',
          Team1: '',
          GroupName1: '*田晟宬',
          Team2: '',
          GroupName2: '王晨帆',
          Result: '1:1',
          TeamResult: null,
          JiFen1: null,
          JiFen2: null
        },
        {
          table: '2-2',
          Team1: '',
          GroupName1: '刘昊炎',
          Team2: '',
          GroupName2: '*王亨鑫',
          Result: '1:1',
          TeamResult: null,
          JiFen1: null,
          JiFen2: null
        },
        {
          table: '2-3',
          Team1: null,
          GroupName1: '*李晶',
          Team2: '',
          GroupName2: '李郑义',
          Result: '0:2',
          TeamResult: null,
          JiFen1: null,
          JiFen2: null
        },
        {
          table: null,
          Team1: '15',
          GroupName1: '湖南省代表队',
          Team2: '3',
          GroupName2: '吉林省代表队',
          Result: '',
          TeamResult: 'Y',
          JiFen1: '0',
          JiFen2: '0'
        },
        {
          table: '3-1',
          Team1: '',
          GroupName1: '*容嘉荣',
          Team2: '',
          GroupName2: '汪文松',
          Result: '1:1',
          TeamResult: '',
          JiFen1: '',
          JiFen2: ''
        },
        {
          table: '3-2',
          Team1: '',
          GroupName1: '段宗昊',
          Team2: '',
          GroupName2: '*邱浩纯',
          Result: '0:2',
          TeamResult: '',
          JiFen1: '',
          JiFen2: ''
        },
        {
          table: '3-3',
          Team1: null,
          GroupName1: '*周楚卉',
          Team2: '',
          GroupName2: '刘铭',
          Result: '2:0',
          TeamResult: '',
          JiFen1: '',
          JiFen2: ''
        },
        {
          table: null,
          Team1: '4',
          GroupName1: '内蒙古代表队',
          Team2: '16',
          GroupName2: '宁波市代表队',
          Result: '',
          TeamResult: 'Y',
          JiFen1: '0',
          JiFen2: '0'
        },
        {
          table: '4-1',
          Team1: '',
          GroupName1: '*钢苏和',
          Team2: '',
          GroupName2: '盛宏安',
          Result: '1:1',
          TeamResult: null,
          JiFen1: null,
          JiFen2: null
        },
        {
          table: '4-2',
          Team1: '',
          GroupName1: '郑策',
          Team2: '',
          GroupName2: '*戚成龙',
          Result: '2:0',
          TeamResult: null,
          JiFen1: null,
          JiFen2: null
        },
        {
          table: '4-3',
          Team1: null,
          GroupName1: '*赛娅',
          Team2: '',
          GroupName2: '空缺',
          Result: '2:0',
          TeamResult: null,
          JiFen1: null,
          JiFen2: null
        },
        {
          table: null,
          Team1: '17',
          GroupName1: '山西省体育局',
          Team2: '5',
          GroupName2: '上海市代表队',
          Result: '',
          TeamResult: 'Y',
          JiFen1: '0',
          JiFen2: '0'
        },
        {
          table: '5-1',
          Team1: '',
          GroupName1: '*胡卓群',
          Team2: null,
          GroupName2: '陶丁舟',
          Result: '1:1',
          TeamResult: '',
          JiFen1: '',
          JiFen2: ''
        },
        {
          table: '5-2',
          Team1: '',
          GroupName1: '韩旭',
          Team2: null,
          GroupName2: '*杜卓远',
          Result: '2:0',
          TeamResult: '',
          JiFen1: '',
          JiFen2: ''
        },
        {
          table: '5-3',
          Team1: null,
          GroupName1: '*廉博',
          Team2: null,
          GroupName2: '戴嘉璐',
          Result: '0:2',
          TeamResult: '',
          JiFen1: '',
          JiFen2: ''
        },
        {
          table: null,
          Team1: '6',
          GroupName1: '四川省代表队',
          Team2: '18',
          GroupName2: '安徽省代表队',
          Result: '',
          TeamResult: 'Y',
          JiFen1: '0',
          JiFen2: '0'
        },
        {
          table: '6-1',
          Team1: '',
          GroupName1: '*周伟',
          Team2: null,
          GroupName2: '汪润',
          Result: '2:0',
          TeamResult: null,
          JiFen1: null,
          JiFen2: null
        },
        {
          table: '6-2',
          Team1: '',
          GroupName1: '季炜明',
          Team2: null,
          GroupName2: '*游德义',
          Result: '1:1',
          TeamResult: null,
          JiFen1: null,
          JiFen2: null
        },
        {
          table: '6-3',
          Team1: null,
          GroupName1: '*阿拉腾花',
          Team2: null,
          GroupName2: '王田翠',
          Result: '0:2',
          TeamResult: null,
          JiFen1: null,
          JiFen2: null
        },
        {
          table: null,
          Team1: '19',
          GroupName1: '青海省代表队',
          Team2: '7',
          GroupName2: '浙江省代表队',
          Result: '',
          TeamResult: 'Y',
          JiFen1: '0',
          JiFen2: '0'
        },
        {
          table: '7-1',
          Team1: '',
          GroupName1: '*陈章',
          Team2: null,
          GroupName2: '金坚强',
          Result: '0:2',
          TeamResult: '',
          JiFen1: '',
          JiFen2: ''
        },
        {
          table: '7-2',
          Team1: '',
          GroupName1: '张乐驰',
          Team2: null,
          GroupName2: '*李宇翔',
          Result: '0:2',
          TeamResult: '',
          JiFen1: '',
          JiFen2: ''
        },
        {
          table: '7-3',
          Team1: null,
          GroupName1: '*郝思佳',
          Team2: null,
          GroupName2: '叶春花',
          Result: '0:2',
          TeamResult: '',
          JiFen1: '',
          JiFen2: ''
        },
        {
          table: null,
          Team1: '8',
          GroupName1: '北京市代表队',
          Team2: '20',
          GroupName2: '重庆市代表队',
          Result: '',
          TeamResult: 'Y',
          JiFen1: '0',
          JiFen2: '0'
        },
        {
          table: '8-1',
          Team1: '',
          GroupName1: '*干启航',
          Team2: null,
          GroupName2: '张磊',
          Result: '0:2',
          TeamResult: null,
          JiFen1: null,
          JiFen2: null
        },
        {
          table: '8-2',
          Team1: '',
          GroupName1: '李垠圻',
          Team2: null,
          GroupName2: '*熊云博',
          Result: '1:1',
          TeamResult: null,
          JiFen1: null,
          JiFen2: null
        },
        {
          table: '8-3',
          Team1: null,
          GroupName1: '*杨苓',
          Team2: null,
          GroupName2: '万佳丽',
          Result: '0:2',
          TeamResult: null,
          JiFen1: null,
          JiFen2: null
        },
        {
          table: null,
          Team1: '21',
          GroupName1: '江苏省代表队',
          Team2: '9',
          GroupName2: '广东省代表队',
          Result: '',
          TeamResult: 'Y',
          JiFen1: '0',
          JiFen2: '0'
        },
        {
          table: '9-1',
          Team1: null,
          GroupName1: '*孙铭',
          Team2: null,
          GroupName2: '罗百顺',
          Result: '0:2',
          TeamResult: '',
          JiFen1: '',
          JiFen2: ''
        },
        {
          table: '9-2',
          Team1: null,
          GroupName1: '杨浩颖',
          Team2: null,
          GroupName2: '*王振宇',
          Result: '0:2',
          TeamResult: '',
          JiFen1: '',
          JiFen2: ''
        },
        {
          table: '9-3',
          Team1: null,
          GroupName1: '*王清圆',
          Team2: null,
          GroupName2: '罗柏莹',
          Result: '2:0',
          TeamResult: '',
          JiFen1: '',
          JiFen2: ''
        },
        {
          table: null,
          Team1: '10',
          GroupName1: '天津市代表队',
          Team2: '22',
          GroupName2: '黑龙江省代表队',
          Result: '',
          TeamResult: 'Y',
          JiFen1: '0',
          JiFen2: '0'
        },
        {
          table: '10-1',
          Team1: '',
          GroupName1: '*吴弋泉',
          Team2: null,
          GroupName2: '王若维',
          Result: '2:0',
          TeamResult: null,
          JiFen1: null,
          JiFen2: null
        },
        {
          table: '10-2',
          Team1: '',
          GroupName1: '石岳',
          Team2: null,
          GroupName2: '*王子诚',
          Result: '2:0',
          TeamResult: null,
          JiFen1: null,
          JiFen2: null
        },
        {
          table: '10-3',
          Team1: null,
          GroupName1: '*邓莉',
          Team2: null,
          GroupName2: '么坤',
          Result: '2:0',
          TeamResult: null,
          JiFen1: null,
          JiFen2: null
        },
        {
          table: null,
          Team1: '23',
          GroupName1: '陕西省代表队',
          Team2: '11',
          GroupName2: '江西省代表队',
          Result: '',
          TeamResult: 'Y',
          JiFen1: '0',
          JiFen2: '0'
        },
        {
          table: '11-1',
          Team1: '',
          GroupName1: '*韩东霖',
          Team2: null,
          GroupName2: '汪易峰',
          Result: '0:2',
          TeamResult: '',
          JiFen1: '',
          JiFen2: ''
        },
        {
          table: '11-2',
          Team1: '',
          GroupName1: '张一航',
          Team2: null,
          GroupName2: '*陈治政',
          Result: '0:2',
          TeamResult: '',
          JiFen1: '',
          JiFen2: ''
        },
        {
          table: '11-3',
          Team1: null,
          GroupName1: '*刘衡宇',
          Team2: null,
          GroupName2: '俞盈',
          Result: '0:2',
          TeamResult: '',
          JiFen1: '',
          JiFen2: ''
        },
        {
          table: null,
          Team1: '12',
          GroupName1: '青岛市代表队',
          Team2: '24',
          GroupName2: '河南省代表队',
          Result: '',
          TeamResult: 'Y',
          JiFen1: '0',
          JiFen2: '0'
        },
        {
          table: '12-1',
          Team1: '',
          GroupName1: '*丁家宝',
          Team2: null,
          GroupName2: '秦睿彤',
          Result: '2:0',
          TeamResult: null,
          JiFen1: null,
          JiFen2: null
        },
        {
          table: '12-2',
          Team1: '',
          GroupName1: '于庚艺',
          Team2: null,
          GroupName2: '*甄士豪',
          Result: '2:0',
          TeamResult: null,
          JiFen1: null,
          JiFen2: null
        },
        {
          table: '12-3',
          Team1: null,
          GroupName1: '*王艺晓',
          Team2: null,
          GroupName2: '侯奕含',
          Result: '2:0',
          TeamResult: null,
          JiFen1: null,
          JiFen2: null
        }
      ],
      singleItemList: [
        {
          name: '国际跳棋',
          logo: require('../../assets/img/daily/DR.png'),
          flag: true
        }
      ]
    }
  },
  watch: {},
  computed: {},
  filters: {},
  components: {},
  methods: {
    getTableTeamStyle(TeamName1, TeamName2) {
      if ((TeamName1 && TeamName1.includes('代表队')) || TeamName1.includes('体育局')) {
        return 'table-team-style-1'
      } else if ((TeamName2 && TeamName2.includes('代表队')) || TeamName2.includes('体育局')) {
        return 'table-team-style-2'
      } else {
        return
      }
    },
    getTableOtherStyle(TeamName) {
      if ((TeamName && TeamName.includes('代表队')) || TeamName.includes('体育局')) {
        return 'table-other-style'
      } else {
        return
      }
    }
  }
}
</script>
<style scoped lang="scss">
@import '@/assets/scss/item.scss';
</style>
